<script type="text/javascript">  	
	$(document).ready(function(){
		var projectId = sessvars.sessionObj['projectId']
    	$('select#id_mapInstance_name').change(function() { 
    		var mapInstanceId = $(this).val();
			$.ajax({
				type: "POST",
				url: '/pmp/maps/',
				data: JSON.stringify({'projectId': projectId, 'select': 'mapInstance', 'mapInstanceId': mapInstanceId, 'mapInstanceForm': $('form#mapInstanceF').serializeObject()}),
				success: function(data){
					$('#mapsForm').html(data)	        
				}
			});
    	})
    	$('#psubId').val(sessvars.sessionObj['projectId'])
    	$('#mapInstanceId').val($('select#id_mapInstance_name').find("option:selected").val())
    	if (($("#mapField:contains('Currently')")).length > 0){$('#unzip').removeAttr('checked'); $('#validMapFile').val(true);}
	})
	function addMapInstance(){
		var projectId = sessvars.sessionObj['projectId']
		$.ajax({
			type: "POST",
			url: '/pmp/maps/',
			data: JSON.stringify({'projectId': projectId, 'select': 'add', 'mapInstanceForm': $('form#mapInstanceF').serializeObject(),}),
			success: function(data){
				$('#mapsForm').html(data)	        
			}
		});
	}
	$('form#mapIF').ajaxForm({
		success: function(data){
			$('#mapsForm').html(data)
			$('#success').fadeIn().delay(2000).fadeOut(1000);    
		}
	})
	function deleteMapInstance(){
		var projectId = sessvars.sessionObj['projectId']
		var mapInstanceId = $('select#id_mapInstance_name').find("option:selected").val()
		$.ajax({
			type: "POST",
			url: '/pmp/maps/',
			data: JSON.stringify({'projectId': projectId, 'select': 'deleteMap', 'mapInstanceId': mapInstanceId}),
			success: function(data){
				$('#mapsForm').html(data)
				$('#success').fadeIn().delay(4000).fadeOut(1000);    
			}
		});
	}
	$('.nav-tabs').button()
</script>

{% load widget_tweaks %}

{% if mapFD %}
<form id="mapInstanceF" class="form-horizontal">
	{{ mapFD.management_form }}
	<div class="control-group">
		<label class="control-label">Select or add a map</label>
		<div class="controls">{{ mapFD.name }}
			<input type="image" src="/static/admin/img/icon_addlink.gif" width="10" height="10" alt="Add Another" onclick="addMapInstance(); return false;">
		</div>
	</div>
</form>
{% endif %}

{% if mapInstance %}
{{ mapInstance.management_form }}
<form id="mapIF" action="submit" method="post" class="form-horizontal">
	<input type="hidden" name="projectId" id="psubId"\>
	<input type="hidden" name="mapInstanceId" id="mapInstanceId"\>
	<input type="hidden" name="validMapFile" id="validMapFile"\>
	{% for field in mapInstance %}
	{% if field.label != 'Map tiler zip file' %}
		<div class="control-group">
			<label class="control-label">{{ field.label }}</label>
			<div class="controls">{{ field }}{% if submit %}{{ field.errors }}{% endif %}
			</div>
		</div>
	{% endif %}
	{% if field.label == 'Map tiler zip file' %}
		<div class="control-group">
			<label class="control-label">MapTiler zip file</label>
			<div class="controls form-inline" id="mapField">{{ field }}{% if submit %}{{ field.errors }}{% endif %}
			</div>
		</div>
	{% endif %}
	{% endfor %}
	<p><label class="checkbox"><input type="checkbox" id="unzip" name="unzip" checked \>Unzip files to create map (Will overwrite existing files)</label></p>
	<p style="margin-top: 5px"><input type="submit" class="btn" value="Save" />
		<input type="button" class="btn" value="Cancel" onclick="addMapInstance(); return false;"/>
		<input type="button" class="btn" value="Delete" onclick="deleteMapInstance(); return false;"/>
		<span id="success"><strong>&nbsp;&nbsp;{{ saveStatus }}</strong></span>
	</p>
</form>
{% endif %}
